<template>
    <div>
        <div id="slider" class="mui-slider">
				<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
					<div class="mui-scroll">
						<a class="mui-control-item mui-active" href="#item1mobile" data-wid="tab-top-subpage-1.html">
							推荐
						</a>
						<a class="mui-control-item" href="#item2mobile" data-wid="tab-top-subpage-2.html">
							热点
						</a>
						<a class="mui-control-item" href="#item3mobile" data-wid="tab-top-subpage-3.html">
							北京
						</a>
						<a class="mui-control-item" href="#item4mobile" data-wid="tab-top-subpage-4.html">
							社会
						</a>
							
					</div>
				</div>
                <ul class="layimg">
                    <router-link  :to="'/potoInfo/'+item.id" tag='li'   v-for="item in list" :key="item.id">
                        <img v-lazy="item.url">
                    </router-link>
                </ul>

			</div>
    </div>
</template>
<script>
// import mui from '../mui/js/mui.js'
// mui('.mui-scroll-wrapper').scroll({
// 	deceleration: 0.0005 
// });  这些与webpack打包后的js启用的严格模式发生了冲突
export default {
    data(){
        return{
            list:[
                {id:1,url:'https://ss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/image/h%3D300/sign=e6cb69522534349b6b066885f9eb1521/91ef76c6a7efce1b5ef04082a251f3deb58f659b.jpg'},
                {id:2,url:'https://ss0.baidu.com/94o3dSag_xI4khGko9WTAnF6hhy/image/h%3D300/sign=a284ee4bc595d143c576e22343f18296/0b7b02087bf40ad182fac5ab5a2c11dfa9ecce58.jpg'},
                {id:3,url:'https://ss1.baidu.com/-4o3dSag_xI4khGko9WTAnF6hhy/image/h%3D300/sign=8000a165df1b0ef473e89e5eedc551a1/b151f8198618367afe76969623738bd4b21ce5fa.jpg'}
           ]
        }
    }
}
</script>
<style scoped>
img[lazy=loading] {
  width: 40px;
  height: 300px;
  margin: auto;
}
.layimg{
   list-style: none;
   margin: 0;padding: 0;
}
/* .layimg img{
    width: 100%
} */
</style>

